<template>
	<div id="app">
		<router-view v-if="isShow"></router-view>
	</div>
</template>
<script>

export default {
	name: "app",
	data() {
		return {
			isShow: true,
			screenWidth: window.screen.width
		};
	},
	created() {
		this.getSystemInfo();
	},
	mounted() {
		this.resize();
	},
	methods: {
		getSystemInfo() {
			console.log("navigator", navigator);
			console.log("performance", window.performance);
			console.log("total memory", window.performance.memory.totalJSHeapSize / 1024 / 1024, "MB");
			console.log("used memory", window.performance.memory.usedJSHeapSize / 1024 / 1024, "MB");
			console.log("limit memory", window.performance.memory.jsHeapSizeLimit / 1024 / 1024, "MB");
		},
		reloadRoute() {
			this.isShow = false;
			this.$nextTick(() => {
				this.isShow = true;
			});
		},
		reloadPage() {
			this.message.info("刷新页面, 释放内存");
			window.addEventListener("beforeunload", (e) => {
				this.reloadRoute();
			});
		},
		resize() {
			this.screenWidth = window.screen.width;
			this.viewWidth = document.body.clientWidth;
			window.onresize = () => {
				return (() => {
					let screenWidth = window.screen.width;
					this.viewWidth = document.body.clientWidth;
					if (screenWidth === this.viewWidth && screenWidth !== this.screenWidth) {
						this.screenWidth = screenWidth;
						location.replace(location);
					}
				})();
			};
		}
	},
	destroyed() {
		window.removeEventListener("onresize", () => {
		});
		window.removeEventListener("beforeunload", e => {
			this.resetVuex();
			this.message.info("关闭页面, 释放内存");
		});
	}
};
</script>

<style>
@import "./index.css";

#app {
	font-family: "Avenir", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-align: center;
	color: #2C3E50;
	width: 100%;
	height: 100%;
}

#app >>> .el-card {
	background-color: #F5F5F5;
}

#app >>> .el-input__inner {
	text-align: center;
}
</style>
